/*! \brief
 * This is Pager javascript component
 * Please follow below step to use Pager component:
 * 1. create <ul class="pager"></ul> in UI
 * 2. insert below code in your js file

renderContent: function(){
    // Pager
    this._refreshPager();
},
_refreshPager: function(){
    var data = 'module=modSCloud&taskAction=GetScopeListByUser&userID=root&pageNum=1&pageSize=100';
    this.proxyRequest(data,this._getTotalRowSuccess.bind(this),this._getTotalRowFailure.bind(this));
},
_getTotalRowSuccess: function(response){  //After get Total row num, new WFPager with options
    var data = JSON.decode(response);
    if(data && data.DocumentElement && data.DocumentElement.ScopeList){
        var list = data.DocumentElement.ScopeList;
        var intTotalNumber = list[0].TotalRow;
        //Pager
        var strPathJs = homeBase + 'ui/pager/Pager.js';

        Asset.javascript(strPathJs, {
            onLoad: function(){
                var intPagerCurrentPage = this.intPagerCurrentPage ? this.intPagerCurrentPage : '';
                var intPagerPerPage = '';
                if(this.intPagerPerPage){ //if intPagerPerPage which get from Pager.js is existed
                    intPagerPerPage = this.intPagerPerPage;
                }else{ //get intPagerPerPage from Pager.js pager_per_page element if existed
                    intPagerPerPage = this.intPagerPerPage;
                    this.pager_per_page = this.boxBD.getElement('.pager_per_page select');
                    if($chk(this.pager_per_page)){
                        intPagerPerPage = this.pager_per_page.getSelected().get('value');
                    }
                }
                var options = {
                    intPagerCurrentPage: intPagerCurrentPage,
                    intPagerPerPage:  intPagerPerPage,
                    objPager : this.boxBD.getElement('.pager'),
                    intPagerTotalNum: intTotalNumber,
                    //arrSelectOption: [1,2,3],
                    objCaller: this,
                    callbackRefreshPagerList: 'getScopeListByAjax'
                }
                new WFPager(options);
            }.bind(this)
        });
    }
},
_getTotalRowFailure: function(){
},
getScopeListByAjax: function(){
    // WFPager will set this.intPagerCurrentPage and this.intPagerPerPage for you
    // you can use these two variable to request you Pager List
    var intPagerCurrentPage = this.intPagerCurrentPage ? this.intPagerCurrentPage : '1';
    var intPagerPerPage = this.intPagerPerPage ? this.intPagerPerPage : '10';
    var intProductID = this.product_id_select.getSelected().get('value');
    var data = 'module=modSCloud&taskAction=GetScopeListByUser&productID='+intProductID+'&userID=root&pageNum='+intPagerCurrentPage+'&pageSize='+intPagerPerPage;
    this.proxyRequest(data,this._displaySuccess.bind(this),this._displayFailure.bind(this));
}

 * \author William Su
 */
var WFPager = new Class({
    Implements: [Options],
    options: {
        objPager: {}, // EX : this.boxBD.getElement('.pager')
        intPagerCurrentPage: 1, // current page of Pager
        intPagerTotalNum: 0, // total row num of Pager
        intPagerPerPage: 10, // record per page of Pager
        arrSelectOption: [10,20,30], // arrSelectOption record_per_page of Pager, EX: [10,20,30]
        //objCaller: {}, // EX : if modScopeList use Pager, in modScopeList/module.js ==> objCaller = this;
        callbackRefreshPagerList: '' //objCaller callback function to refresh Pager List
    },
    pager: {}, //alias of this.options.objPager
    initialize: function(options) {
        this.setOptions(options);
        this.pager = this.options.objPager;
        this.pager.addClass('comPager');
        var strHtmlPager = [
                        '<ul>',
                        '    <li class="records">'+lang.label('pager_records')+': <span class="pager_start_cont">1</span>&nbsp;-&nbsp;<span class="pager_end_cont">1</span> / <span class="pager_total_num">1</span> </li>',
                        '    <li class="btn btn_first disabled"></li>',
                        '    <li class="btn btn_prev disabled"></li>',
                        '    <li class="pageInput">'+lang.label('pager_page')+':&nbsp;&nbsp;<input type="text" class="pager_current_page" />&nbsp;&nbsp;/ <span class="pager_total_page">1</span></li>',
                        '    <li class="btn btn_next disabled"></li>',
                        '    <li class="btn btn_last disabled"></li>',
                        '    <li class="pager_per_page">',
                        '        <select class="pager_option"></select>&nbsp;&nbsp;'+lang.label('pager_per_page')+'',
                        '    </li>',
                        '</ul>'                        
                        ].join('');
        this.pager.set('html',strHtmlPager);

        // get element to be use
        this.btn_first = this.pager.getElement('.btn_first');
        this.btn_prev = this.pager.getElement('.btn_prev');
        this.btn_last = this.pager.getElement('.btn_last');
        this.btn_next = this.pager.getElement('.btn_next');
        this.pager_current_page = this.pager.getElement('.pager_current_page');
        this.pager_per_page = this.pager.getElement('.pager_option');

        // set select=pager_per_page option
        this.options.arrSelectOption.each(function(item,index){
            if(this.options.intPagerPerPage == item){
                new Element('option',{'text':item,'selected':'selected','value':item}).inject(this.pager_per_page,'bottom');
            }else{
                new Element('option',{'text':item,'value':item}).inject(this.pager_per_page,'bottom');
            }
        }.bind(this));

        this._refreshPager();
        return this;
    },
    _refreshPager: function(){
        // Step 1: recalculate Pager variable
        this.options.intPagerPerPage = this._getValidatePagerPerPage(this.options.intPagerPerPage);
        this.options.intPagerTotalPage = Math.ceil(this.options.intPagerTotalNum/this.options.intPagerPerPage);
        this.options.intPagerCurrentPage = this._getValidatePagerCurrentPage(this.options.intPagerCurrentPage);
        this.options.intPagerStartCont = this._getValidatePagerStartCont();
        var intPagerEndCont = this.options.intPagerCurrentPage * this.options.intPagerPerPage;
        this.options.intPagerEndCont = this._getValidatePagerEndCont(intPagerEndCont);

        // Step 2: set Pager variable to UI
        this.pager.getElement('.pager_start_cont').set('html',this.options.intPagerStartCont);
        this.pager.getElement('.pager_end_cont').set('html',this.options.intPagerEndCont);
        this.pager.getElement('.pager_total_num').set('html',this.options.intPagerTotalNum);
        this.pager.getElement('.pager_total_page').set('html',this.options.intPagerTotalPage);

        // Step3-1:
        // - bind button first[<<] event
        // - bind button prev[<] event
        if(this.options.intPagerCurrentPage > 1){
            this.btn_first.removeClass('disabled');
            if(this.btn_first.hasEvent('click') == undefined){
                this.btn_first.addEvent('click',function(){
                    this.options.intPagerCurrentPage = 1;
                    this._refreshPager();
                }.bind(this));
            }

            this.btn_prev.removeClass('disabled');
            if(this.btn_prev.hasEvent('click') == undefined){
                this.btn_prev.addEvent('click',function(){
                    this.options.intPagerCurrentPage = this.options.intPagerCurrentPage - 1;
                    this._refreshPager();
                }.bind(this));
            }
        }else{
            this.btn_first.addClass('disabled');
            this.btn_first.removeEvent('click');
            this.btn_prev.addClass('disabled');
            this.btn_prev.removeEvent('click');
        }

        // Step3-2:
        // - bind input textbox=pager_current_page [ ] event
        this.pager_current_page.set('value', this.options.intPagerCurrentPage);
        if(this.pager_current_page.hasEvent('keydown') == undefined){
            this.pager_current_page.addEvent('keydown',function(event){
                if (event.key == 'enter'){
                    //var intPagerCurrentPage = this.pager_current_page.get('value');
                    //intPagerCurrentPage = this._getValidatePagerCurrentPage(intPagerCurrentPage);
                    this.options.intPagerCurrentPage = this.pager_current_page.get('value');
                    this._refreshPager();
                }
            }.bind(this));
        }

        // Step3-3:
        // - bind button next[>] event
        // - bind button last[>>] event
        if(this.options.intPagerCurrentPage < this.options.intPagerTotalPage){
            this.btn_next.removeClass('disabled');
            if(this.btn_next.hasEvent('click') == undefined){
                this.btn_next.addEvent('click',function(){
                    this.options.intPagerCurrentPage = this.options.intPagerCurrentPage + 1;
                    this._refreshPager();
                }.bind(this));
            }

            this.btn_last.removeClass('disabled');
            if(this.btn_last.hasEvent('click') == undefined){
                this.btn_last.addEvent('click',function(){
                    this.options.intPagerCurrentPage = this.options.intPagerTotalPage;
                    this._refreshPager();
                }.bind(this));
            }
        }else{
            this.btn_last.addClass('disabled');
            this.btn_last.removeEvent('click');
            this.btn_next.addClass('disabled');
            this.btn_next.removeEvent('click');
        }

        // Step3-4:
        // - bind select pager_per_page event
        if(this.pager_per_page.hasEvent('change') == undefined){
            this.pager_per_page.addEvent('change',function(){
                var intPagerPerPage = this.pager_per_page.getSelected().get('value');
                this.options.intPagerPerPage = intPagerPerPage;
                this._refreshPager();
            }.bind(this));
        }
        // Step4: sent [intPagerCurrentPage,intPagerPerPage,intPagerStartCont,intPagerEndCont] Pager information to objCaller to refreshPagerList
        this.intPagerCurrentPage = this.options.intPagerCurrentPage;
        this.intPagerPerPage = this.options.intPagerPerPage;
        this.intPagerStartCont = this.options.intPagerStartCont;
        this.intPagerEndCont = this.options.intPagerEndCont;

        // Step5: call objCaller.refreshPagerList()
        //var callbackRefreshPagerList = 'this.options.objCaller.'+this.options.callbackRefreshPagerList+'();';
        //eval(callbackRefreshPagerList);
        if(this.options.callbackRefreshPagerList){
        	this.options.callbackRefreshPagerList.apply();
        }
    },
    _getValidatePagerCurrentPage: function(intPagerCurrentPage){
        var ret = intPagerCurrentPage;
        if(intPagerCurrentPage < 1){
            ret = 1;
        }else if(this.options.intPagerTotalPage > 0 && intPagerCurrentPage > this.options.intPagerTotalPage){
            ret = this.options.intPagerTotalPage;
        }else if(isNaN(intPagerCurrentPage) == true){
            ret = 1;
        }
        return parseInt(ret);
    },
    _getValidatePagerEndCont: function(intPagerEndCont){
        var ret = intPagerEndCont;
        if(this.options.intPagerCurrentPage == 1 && (intPagerEndCont > this.options.intPagerTotalNum)){
            ret = this.options.intPagerTotalNum;
        }else if(this.options.intPagerCurrentPage == this.options.intPagerTotalPage && (intPagerEndCont > this.options.intPagerTotalNum)){
            ret = this.options.intPagerTotalNum;
        }
        return ret;
    },
    _getValidatePagerPerPage: function(intPagerPerPage){
        var ret = intPagerPerPage;
        if(!intPagerPerPage){
            ret = this.options.arrSelectOption[0];
        }
        return ret;
    },
    _getValidatePagerStartCont: function(){
        var ret = 0;
        if(this.options.intPagerTotalNum > 0){
            ret = ((this.options.intPagerCurrentPage-1) * this.options.intPagerPerPage)+1;
        }
        return ret;
    }
});
